<style lang="less">
  @import './login.less';
</style>

<template>
  <div class="hro-login" id="login">
    <!-- <canvas id="canvas"></canvas> -->
    <img :src="logo_vx" alt="" class="logo_vx">
    <!-- <img :src="logo_knx" alt="" class="logo_knx"> -->
    <div :class="logoImgClass"></div>
    <div :class="sloganClass">
      <div class="text"></div>
    </div>
    <div class="login-con">
      <div class="form-con">
        <login-form @on-success-valid="handleSubmit" :loading="loading"></login-form>
      </div>
    </div>
    <p class="b-text line-h-30">Copyright © 2019-2021 湖南谋谋网络科技有限公司 All Rights Reserved<br/>技术支持：谋谋科技  |  <a class="text-white" target=_blank @click="linkDownload">湘ICP备15015077号-2</a> <br/><span class="pl-30">邮箱：mmkj_ceo@163.com</span></p>
  </div>
</template>

<script>
import userApi from '@/api/user'
import Cookies from 'js-cookie'
import { SysAreaApi } from '@/api/SysArea.api.js'
import fxzpApi from '@/api/fx-zp.api.js'
import { Common } from '@/utils/common.js'
import LoginForm from '_c/third-party-login-form'
import { mapMutations, mapActions } from 'vuex'
import systemApi from '@/api/system.js'
import logo_vx from '@/assets/images/Logo_VXHRO-CLOUD.png'
import config from '@/config'
const logoImgUrl = process.env.NODE_ENV === 'development' ? config.logoUrl.dev : config.logoUrl.pro
const logoImgClass = process.env.NODE_ENV === 'development' ? config.logoClass.dev : config.logoClass.pro
const sloganClass = process.env.NODE_ENV === 'development' ? config.slogan.dev : config.slogan.pro

export default {
  components: {
    LoginForm
  },
  data () {
    return {
      loading: false,
      logo_vx: logo_vx,
      logo_knx: logoImgUrl,
      sloganClass: sloganClass,
      logoImgClass: logoImgClass,
      // login_box: login_box,
      activeClass: '1'
    }
  },
  created () {
    Cookies.set('clientToken', '')
    this.setClientToken('')
    this.setAccess([])
    localStorage.clear()
  },
  mounted () {
    // this.canvasLine()
  },

  methods: {
    ...mapMutations([
      'setClientToken',
      'setUserId',
      'setAccess',
      'setUserName',
      'setAvator',
      'setHasGetInfo',
      'setCompanyID'
    ]),
    ...mapActions([
      'handleLogin'
    ]),

    handleSubmit ({ userName, password }) {
      userName = userName.trim()
      this.loading = true
      userApi.axLoginOauth({
        userName: userName,
        password: password,
        ukey: this.$route.query.uken,
        clientId: this.$route.query.clientId,
        clientSecret: this.$route.query.clientSecret
      }).then(res => {
        const data = res.data
        if (data.success) {
          localStorage.setItem('clientLoginInfo', JSON.stringify(data))
          let access_arr = data.data.menus.map(item => {
            return item.code
          })
          this.setClientToken(data.data.access_token)
          this.setHasGetInfo(true)
          this.setUserId()
          this.setAccess(access_arr)
          this.setUserName(data.data.name)
          this.setAvator('@/assets/images/default_photo1.png')
          this.$router.push({
            name: this.$config.homeName
          })
          this.getProvince()
          this.getAreaTree()
          this.getFXZPSelectVal()
        } else {
          this.$Message.error({
            content: data.message,
            duration: 10,
            closable: true
          })
          this.loading = false
        }
      })
    },

    chooseIdentity (e) {
      this.activeClass = e.srcElement.dataset.id
    },

    // 获取全国省份
    async getProvince () {
      let resp = await SysAreaApi.getProvince()
      if (resp.status === 200) {
        localStorage.setItem('provinceList', JSON.stringify(resp.data.data))
      }
    },

    // 获取中国所有城市树
    async getAreaTree () {
      let res = await SysAreaApi.getAreaTree()
      console.log('获取中国所有城市树: ', res)
      if (res.status === 200 && res.data.success) {
        localStorage.setItem('areaTree', JSON.stringify(res.data.data))
      } else {
      }
    },
    // 获取分享招聘系统下拉值
    getFXZPSelectVal () {
      fxzpApi.GetSelectValList({
        intPageSize: 10000,
        intPageIndex: 1
      }).then(res => {
        console.log(res)
        localStorage.setItem('FXZP_STATUS', JSON.stringify(res.data.data))
      })
    },

    // 点击备案号
    linkDownload () {
      // window.open('http://www.baidu.com', '_blank')
      window.open('http://beian.miit.gov.cn', '_blank')
    }
  }
}
</script>
